<template>
  <a-modal v-model="visible" :width="800" :title="modelTitle" @cancel="handleCancel()">
    <a-form-model ref="ruleForm" :model="form" :rules="rules" style="max-width: 700px; margin: 10px auto 0;" :labelCol="{span: 8}" :wrapperCol="{span: 16}">
      <div class="cWarp" v-if="form.algorithmCode=='001'">
        <div class="title">时间阈值设置</div>
        <a-form-model-item>
          <template slot="label">
            <span style='color:red'>*</span> 解锁时间阈值
          </template>
          <div style='display:flex;height:40px;'>
            <a-form-model-item prop="unlockThresholdMinValue">
              <a-input-number :min="0" :max="form.unlockThresholdMaxValue||0" :step="1" v-model='form.unlockThresholdMinValue' style='width:120px' placeholder='最小值' /> --&nbsp;
            </a-form-model-item>
            <a-form-model-item prop="unlockThresholdMaxValue">
              <a-input-number :min="0" :max="999999" :step="1" v-model='form.unlockThresholdMaxValue' style='width:120px' placeholder='最大值' /> ms
            </a-form-model-item>
          </div>
        </a-form-model-item>

        <a-form-model-item>
          <template slot="label">
            <span style='color:red'>*</span> 闭锁时间阈值
          </template>
          <div style='display:flex;height:40px;'>
            <a-form-model-item prop="lockThresholdMinValue">
              <a-input-number :min="0" :max="form.lockThresholdMaxValue||0" :step="1" v-model='form.lockThresholdMinValue' style='width:120px' placeholder='最小值' /> --&nbsp;
            </a-form-model-item>
            <a-form-model-item prop="lockThresholdMaxValue">
              <a-input-number :min="0" :max="999999" :step="1" v-model='form.lockThresholdMaxValue' style='width:120px' placeholder='最大值' /> ms
            </a-form-model-item>
          </div>
        </a-form-model-item>
      </div>

      <div class="cWarp">
        <div class="title">
          <span>参数权值设置 </span>
          <a-popover  v-if="form.algorithmCode=='001'">
            <template slot="content">
              <div class="tipContent">
                <p>指标之间比较量化值规定:</p>
                <a-table :columns="columns" :data-source="tipData" size="small" :pagination='false' bordered></a-table>
              </div>
            </template>
            <a-icon type="exclamation-circle" style='color:#2997fd' />
          </a-popover>
        </div>

        <!-- jsd算法 -->
        <a-form-model-item v-if="form.algorithmCode=='002'" label="电机算法阈值" prop="motorThreshold">
          <a-input-number style='width:200px' v-model="form.motorThreshold" :min='0.1' :max='1' :step="0.1" :precision='1'></a-input-number>
          <span class="tip">（系统推荐值: 0.5）</span>

        </a-form-model-item>

        <span  v-if="form.algorithmCode=='001'">
          <a-form-model-item label="解锁时间权值A1" prop="unlockTimeWeightA1">
            <a-select style='width:200px' v-model='form.unlockTimeWeightA1' placeholder='请选择'>
              <a-select-option v-for="i in sList" :key="i">{{i}}</a-select-option>
            </a-select>
            <span class="tip">（系统推荐值：7）</span>
          </a-form-model-item>
          <a-form-model-item label="闭锁时间权值A2" prop="lockTimeWeightA2">
            <a-select style='width:200px' v-model='form.lockTimeWeightA2' placeholder='请选择'>
              <a-select-option v-for="i in sList" :key="i" :disabled="i>form.unlockTimeWeightA1">{{i}}</a-select-option>
            </a-select>
            <span class="tip">（系统推荐值：5）</span>
          </a-form-model-item>
          <a-form-model-item label="解锁故障权值A3" prop="unlockFaultWeightA3">
            <a-select style='width:200px' v-model='form.unlockFaultWeightA3' placeholder='请选择'>
              <a-select-option v-for="i in sList" :key="i" :disabled="i>form.lockTimeWeightA2">{{i}}</a-select-option>
            </a-select>
            <span class="tip">（系统推荐值：3）</span>
          </a-form-model-item>
          <a-form-model-item label="闭锁故障权值A4" prop="lockFaultWeightA4">
            <a-select style='width:200px' v-model='form.lockFaultWeightA4' placeholder='请选择'>
              <a-select-option v-for="i in sList" :key="i" :disabled="i>form.unlockFaultWeightA3">{{i}}</a-select-option>
            </a-select>
            <span class="tip">（系统推荐值：1）</span>
          </a-form-model-item>
        </span>

      </div>

    </a-form-model>
    <template #footer>
      <a-button type="info" @click="handleCancel">取消</a-button>
      <a-button type="primary" @click="confirm">提交</a-button>
    </template>
  </a-modal>
</template>

<script>
import { postAction } from '@/api/manage'
export default {
  data() {
    return {
      modelTitle: '算法配置',
      visible: false,
      form: {
        unlockThresholdMinValue: 0,
        unlockThresholdMaxValue: 0,
        lockThresholdMinValue: 0,
        lockThresholdMaxValue: 0,
        unlockTimeWeightA1: 7,
        lockTimeWeightA2: 5,
        unlockFaultWeightA3: 3,
        lockFaultWeightA4: 1,
        motorThreshold: 0.5
      },
      sId: '',
      rules: {
        unlockThresholdMinValue: [
          { required: true, message: '请输入最小阈值', trigger: 'blur' },
          // { pattern: /^[0-9]{1,6}$/, message: '请输入1-6位正整数' }
        ],
        unlockThresholdMaxValue: [{ required: true, message: '请输入最大阈值', trigger: 'blur' }],
        lockThresholdMinValue: [{ required: true, message: '请输入最小阈值', trigger: 'blur' }],
        lockThresholdMaxValue: [{ required: true, message: '请输入最大阈值', trigger: 'blur' }],
        unlockTimeWeightA1: [{ required: true, message: '请选择', trigger: 'change' }],
        lockTimeWeightA2: [{ required: true, message: '请选择', trigger: 'change' }],
        unlockFaultWeightA3: [{ required: true, message: '请选择', trigger: 'change' }],
        lockFaultWeightA4: [{ required: true, message: '请选择', trigger: 'change' }],
        motorThreshold: [{ required: true, message: '请输入', trigger: 'change' }],
      },
      columns: [
        {
          key: '1',
          title: '因素i比因素j',
          dataIndex: 'name',
          width: 150,
          align: "center",
        },
        {
          key: '2',
          title: '量化值',
          dataIndex: 'value',
          width: 100,
          align: "center",
        },
      ],
      tipData: [
        {
          key: '1',
          name: '同等重要',
          value: '1',
        },
        {
          key: '2',
          name: '稍微重要',
          value: '3',
        },
        {
          key: '3',
          name: '较强重要',
          value: '5',
        },
        {
          key: '4',
          name: '强烈重要',
          value: '7',
        },
        {
          key: '5',
          name: '极端重要',
          value: '9',
        },
        {
          key: '7',
          name: '两相邻判断的值',
          value: '2,4,6,8',
        },
      ],
      sList: [1, 3, 5, 7, 9]
    }
  },
  watch:{
    'form.unlockTimeWeightA1':{
      handler(val){
        if(val<this.form.lockTimeWeightA2){
          this.form.lockTimeWeightA2 = null
          this.form.unlockFaultWeightA3 = null
          this.form.lockFaultWeightA4 = null
        }
      },
      immediate:true
    },
    'form.lockTimeWeightA2':{
      handler(val){
        if(val<this.form.unlockFaultWeightA3){
          this.form.unlockFaultWeightA3 = null
          this.form.lockFaultWeightA4 = null
        }
      },
      immediate:true
    },
    'form.unlockFaultWeightA3':{
      handler(val){
        if(val<this.form.lockFaultWeightA4){
          this.form.lockFaultWeightA4 = null
        }
      },
      immediate:true
    }    
  },
  mounted() {

  },
  methods: {
    confirm() {
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          let params = JSON.parse(JSON.stringify(this.form))
          postAction('/healthy/gdPredictionAlgorithm/edit', params).then(res => {
            if (res.code == 200) {
              this.$emit('success')
              this.$message.success(res.message)
              this.visible = false
              this.$refs['ruleForm'].clearValidate()
            }
          })
        }
      });
    },
    handleCancel() {
      this.$emit('success')
      this.visible = false
      this.$refs['ruleForm'].resetFields()
    }
  }
}
</script>

<style lang="less" scoped>
.title {
  font-size: 18px;
  padding-bottom: 10px;
}
.cWarp {
  border: 1px solid #e9e9e9;
  padding: 25px;
  &:nth-child(2) {
    margin-top: 15px;
  }

  .tip {
    color: #c5c5c5;
  }
}
.tipContent {
  p {
    font-size: 16px;
  }
  /deep/ .ant-table-small > .ant-table-content > .ant-table-body {
    margin: 0 !important;
  }
}
</style>